<!doctype html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>轮播图实例</title>
	<link rel="stylesheet" type="text/css" href="css/style.css">
</head>
<body>
	<div class='main' id='main'>
		<!--图片轮播-->
		<div class='banner' id="banner">
			<a href="#">
				<div class='banner-slide slide1 slide-active'></div>
			</a>
			<a href="#">
				<div class='banner-slide slide2'></div>
			</a>
			<a href="#"> 
				<div class='banner-slide slide3'></div>
			</a>
		</div>
		<!--上一张、下一张按钮-->
		<a href="javascipt:void(0)" class='button prev' id='prev'></a>
		<a href="javascipt:void(0)" class='button next' id='next'></a>
		<!--原点导航-->
		<div class='dots' id='dots'>
			<span class='active'></span>
			<span></span>
			<span></span>
		</div>
	</div>
	<script type="text/javascript" src='js/script.js'></script>
</body>
</html>